﻿<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    <link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_2594013_w1zuiosw8qb.css" />
    <link rel="stylesheet" type="text/css" href="~/Content/MasterPageCss.css" />
</head>
<body>
    <nav>
        <div class="TopDiv01">
            <img src="../image/logo/yinLogo.png" />
            <div class="TopDiv01_Kong"></div>
            <div>
                <a href="#">官方微博</a>|
                <a href="#">关注微信</a>|
                <a href="#">预购须知</a>
            </div>
        </div>
        <div class="TopDiv02">
            <img class="logImage" src="../image/logo/shop-logo-v1.png" />
            <div class="TopSearch">
                <input id="TopSearchInput" type="text" placeholder="搜索偶像 商品" />
            </div>
            <div class="LogInDiv">
                <ul>
                    <li>
                        <img src="../image/icon/avatar.png" />
                        <a href="#" id="DengLu">登录</a>
                    </li>
                    <li>
                        <a href="#">我的订单</a>
                    </li>
                    <li>
                        <img src="../image/icon/cart-logo-v1.png" />
                        <a href="#">购物车</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="OptionsColumns">
            <span>艺人分类</span>
            <ul>
                <li class="OptionsColumnsClick">
                    <a href="/Musc_Shop/Home">首页</a>
                </li>
                <li>
                    <a href="/Musc_Shop/Classification">专辑</a>
                </li>
                <li>
                    <a href="#">明星周边</a>
                </li>
                <li>
                    <a href="#">明星同款</a>
                </li>
                <li>
                    <a href="#">个护美妆</a>
                </li>
                <li>
                    <a href="#">影漫周边</a>
                </li>
                <li>
                    <a href="#">食品</a>
                </li>
                <li>
                    <a href="#">服装配饰</a>
                </li>
            </ul>
        </div>
    </nav>
    <div>
        @RenderBody()
    </div>
    <footer>
        <div class="GuaranteeDiv">
            <div align="center">
                <img class="A" src="../image/footer_v180123.png" width="90%" />
            </div>
            <div class="BottonDiv">
                <div>
                    <ul>
                        <li><a href="#">关于我们</a></li>
                        <li>|</li>
                        <li><a href="#">人才招聘</a></li>
                        <li>|</li>
                        <li><a href="#">联系我们</a></li>
                        <li>|</li>
                        <li><a href="#">友情链接</a></li>
                        <li>|</li>
                        <li><a href="#">版权声明</a></li>
                        <li>|</li>
                        <li><a href="#">客服中心</a></li>
                    </ul>
                </div>
                <div class="BottonDivtext">
                    <div style="white-space: pre;">
                        <span class="BottonDivtext01">Copyright © 2009 - 2016 yinyuetai.com 广播电视节目制作经营 许可编号(京)字第1891号 |京网文[2014]2037-287号 | <b style="color: aquamarine;">网络视听许可证0110413号</b></span>
                        <span>京公网安备11010502014900号 | 京ICP备11024134号-1 | 京ICP证060716号 | 出版物经营许可证 新出发京零字第朝130062号 | 增值电信业务经营许可证B2-20140501</span>
                        <span>食品经营许可s证:JY11105040485363 | 营业执照</span>
                    </div>
                    <img src="../image/biaoshi.gif" />
                </div>
            </div>
        </div>
    </footer>

    <div class="popUpWindow" style="display:none">
        <div style="background-image: url(../image/pop-bg.jpg);">
            <div class="LogInWindow">
                <div class="LogInWindowTop">
                    <span id="DengLuBut" class="LogInWindowTopClick">登录</span>
                    <span id="ZhuCheBut">注册</span>
                </div>
                <div class="LogInWindowInput">
                    <input type="text" placeholder="请输入手机号码或电子邮箱" />
                    <input type="password" placeholder="请输入密码" />
                    <input type="checkbox" checked="checked" style="width: 20px;margin-right: 10px;" />自动登录
                    <span id="Submitbut">登录</span>
                </div>
                <div class="RegisteredWindowInput" style="display: none;">
                    <input type="text" id="phoneNumber" placeholder="输入手机号" />
                    <span class="phoneTiShi">请输入手机号</span>
                    <input type="password" placeholder="请输入密码" />
                    <input type="password" placeholder="请输入验证码" style="width: 50%;" />
                    <span class="GetYam" id="yes">获取验证码</span>
                    <span id="Submitbut">注册</span>
                    <input type="checkbox" checked="checked" style="width: 20px;margin-right: 10px;" />我已阅读并同意(音悦Tai服务条款)
                </div>
            </div>
        </div>
    </div>

    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <script>
			$(function() {
				$(".OptionsColumns").on("click", "li", function() {
					var arr = $(".OptionsColumns li");
					for (var i = 0; i < arr.length; i++) {
						arr.removeClass("OptionsColumnsClick");
						$(this).addClass("OptionsColumnsClick");
					}
				});
                $("#DengLuBut").click(function () {
                    $(".LogInWindowInput").css("display", "block");
                    $(".RegisteredWindowInput").css("display", "none");
                    $("#ZhuCheBut").removeClass("LogInWindowTopClick");
                    $(this).addClass("LogInWindowTopClick");
                });
                $("#ZhuCheBut").click(function () {
                    $(".LogInWindowInput").css("display", "none");
                    $(".RegisteredWindowInput").css("display", "block");
                    $(this).addClass("LogInWindowTopClick");
                    $("#DengLuBut").removeClass("LogInWindowTopClick");
                });
				var time01 = setInterval(function() {}, 1000);
				var time01Index = 5;
				$(".GetYam").click(function() {
					if ($("#phoneNumber").val() == "") {
						$(".phoneTiShi").css("display", "block");
						return;
					}
					(async function() {
						await setTimeout(() => {
							time01 = setInterval(function() {
								if (time01Index == 0) {
									$(".GetYam").text("重新发送");
									time01Index = 60;
									clearInterval(time01);
								} else {
									$(".GetYam").text(time01Index);
									time01Index--;
								}
							}, 1000);
						}, 10);
					})();
				})

				$("#phoneNumber").focus(function() {
					$(".phoneTiShi").css("display", "none");
				})

				$(".LogInWindowTop span").click(function() {

				})

				$(".popUpWindow").click(function() {
					$(this).css("display", "none");
				})

				$(".popUpWindow>div").click(function() {
					return false;
				})

				$("#DengLu").click(function() {
					$(".popUpWindow").css("display", "block");
				})
			})
    </script>
</body>
</html>
